<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
    <title>flex布局</title>
    <script src="./index.js"></script>
    <script>
        window.onload = function () {
            var x = document.getElementsByClassName('focus');
            for (var i = 0; i < x.length; i++) {
                // document.write(x[i].innerHTML);
                // alert(x[i].innerHTML);
                x.innerHTML = data.users[0].guanzhu;

            }

        };
    </script>
    <style>
        .flex-contain {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;

        }

        .anthor {
            display: flex;
            flex-direction: row;
        }

        .info {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            padding: 10px;
        }

        .info_1 {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
        }

        img {
            width: 100px;
            height: 100px;
            border-radius: 50%;
        }

        img:hover,
        .name:hover,
        .focus:hover {
            cursor: pointer;
        }

        .focus {
            color: rgb(112, 187, 37);
        }

        .context {
            color: darkgray;
        }
    </style>
</head>

<body>
    <div class="flex-contain">

    </div>
    <script>
        // document.getElementById("name").innerHTML = data.users[0].nickname;
        // document.getElementsByClassName("name").innerHTML = data.users[0].nickname;
        // document.getElementsByClassName('p').innerHTML = 'eeee';
        // document.getElementsByTagName('p').innerHTML = 'ddd';
        // var x = document.getElementById("name");
        // document.write(x);

        // 这个方法返回的是一组类数组对象，不是真正的对象；所有查询到的元素都会封装到对象中；
        // var y = document.getElementsByClassName('focus');
        // document.write(y);
        // $('.p').html();

        


    </script>
</body>

</html>